const config = require("./config/index");
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const OptimizeCssnanoPlugin = require("@intervolga/optimize-cssnano-plugin");
const webpack = require("webpack");
const path = require("path");

/**
 * vue-cli 配置文件
 */

const isProd =
  process.env.VUE_APP_FLAG === "production" ||
  process.env.VUE_APP_FLAG === "prod"; // 是否为生产环境
const name = process.env.VUE_APP_TITLE || "clean-front"; // 网页标题

var plugins = [
  new webpack.DllReferencePlugin({
    context: process.cwd(),
    manifest: require("./public/vendor/vendor-manifest.json"),
  }),
  /* new MiniCssExtractPlugin({
        filename: `[name].css`,
        chunkFilename: '[id].css'
    }), */
  new OptimizeCssnanoPlugin({
    sourceMap: false,
    cssnanoOptions: {
      preset: [
        "default",
        {
          mergeLonghand: false,
          cssDeclarationSorter: false,
        },
      ],
    },
  }),
];
if (isProd) {
  plugins.unshift(
    new UglifyJsPlugin({
      uglifyOptions: {
        compress: {
          drop_debugger: true,
          drop_console: true,
        },
      },
      sourceMap: false,
      parallel: true,
    })
  );
}

module.exports = {
  publicPath: path.resolve(config.baseUrl),
  configureWebpack: {
    name: name, // 网页title 在html里进行设置
    devtool: isProd ? false : "eval-source-map",
    resolve: {
      alias: {
        "@": path.join(__dirname, "src"),
        "~": path.join(__dirname),
      },
    },
    plugins: plugins,
    optimization: {
      splitChunks: {
        cacheGroups: {
          styles: {
            name: "styles",
            test: /\.css$/,
            chunks: "all",
            enforce: true,
          },
        },
      },
    },
  },
  devServer: {
    open: true,
    port: 8080,
    host: "0.0.0.0",
    https: false,
    hotOnly: true,
    disableHostCheck: true,
    proxy: {
      "/serverApi": {
        target: config.RequestUrl,
        changeOrigin: true,
        ws: true,
        pathRewrite: {
          "^/serverApi": "/",
        },
      },
    },
  },
};
